<!DOCTYPE html>
<!-- saved from url=(0070)http://shop.tenfeiba.com/InternetOfThingsManage/backstageUI/index.html -->
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta http-equiv="Content-Language" content="zh-CN">

</head>

<body onload="initData();">

<h2 align="center" style="color: #ffffff;margin-top: 60px; text-shadow: 50px 20px 6px #FFFFFF; "> 铁嘴物联系统后台管理</h2>

<div class="owin"></div>

<table align="center" width="1000" height="500" border="2px" bordercolor="#000000">
    <tbody>
    <tr>
        <td width="30%" style="background-color: #FFFAE8" ;="">

            <div class="item1">

                <span style="font-size: 13px;  color: #000000;">系统时间：</span> <span id="time"
                                                                                   style="font-size: 10px; color: #0000ff;">2018-8-2 15:46:35 星期四</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">网络速度：</span> <span id="net_speech"
                                                                                   style="font-size: 10px; color: #0000ff;">speed:857KB/S —— time：0.239s</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">通讯状态：</span> <span id="comm_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">系统状态：</span> <span id="system_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>

                <span style="font-size: 13px;  color: #000000;">硬件健康：</span> <span id="hardware_heal"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">服务器状态：</span> <span id="service_state"
                                                                                    style="font-size: 10px; color: #0000ff;">——</span>
                <br>

            </div>

        </td>


        <td width="30%" style="background-color: #FFFAE8" ;="">

            <div class="item2">

                <span style="font-size: 13px;  color: #000000;">媒体模块：</span> <span id="media_moudle_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">访客模块：</span> <span id="visit_moudle_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">硬件状态：</span> <span id="monitor_moudle_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">监控模块：</span> <span id="power_moudle_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>

                <span style="font-size: 13px;  color: #000000;">电控模块：</span> <span id="comm_moudle_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">通讯模块：</span> <span id="hardware_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>

            </div>

        </td>


        <td width="30%" style="background-color: #FFFAE8" ;="">

            <div class="item3">

                <span style="font-size: 13px;  color: #000000;">传感器：</span> <span id="hard_monitor_state"
                                                                                  style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">监控器：</span> <span id="sensor_state"
                                                                                  style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">继电器：</span> <span id="hard_relay_state"
                                                                                  style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">受控硬件：</span> <span id="controlled_hardware_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>

                <span style="font-size: 13px;  color: #000000;">终端触摸屏：</span> <span id="terminal_state"
                                                                                    style="font-size: 10px; color: #0000ff;">——</span>
                <br>
                <span style="font-size: 13px;  color: #000000;">传输通道：</span> <span id="tran_channel_state"
                                                                                   style="font-size: 10px; color: #0000ff;">——</span>
                <br>

            </div>

        </td>

    </tr>
    <tr>
        <td width="30%" class="aaa"
            style="background-image:url(img/d.png) ; cursor:pointer; text-align: center;  text-shadow: 50px 20px 6px #FFFFFF; font-size: 23px; font-family: &#39;微软雅黑&#39;; color: #FFFFFF;"
            height="120" onclick="duomieti(&#39;${id}&#39;)">媒体系统
        </td>

        <td width="30%" class="aaa"
            style="background-image:url(img/d.png) ; text-align: center;cursor:pointer;  text-shadow: 50px 20px 6px #FFFFFF;font-size: 23px; font-family: &#39;微软雅黑&#39;; color: #FFFFFF;"
            height="120" onclick="duomieti1(&#39;${id}&#39;)">访客系统
        </td>

        <td width="30%" class="aaa"
            style="background-image:url(img/d.png) ;cursor:pointer; text-align: center; text-shadow: 50px 20px 6px #FFFFFF; font-size: 23px; font-family: &#39;微软雅黑&#39;; color: #FFFFFF;"
            height="120" onclick="duomieti2(&#39;${id}&#39;)">监控系统
        </td>

    </tr>
    <tr>

        <td width="30%" class="aaa"
            style="background-image:url(img/d.png) ; cursor:pointer;text-align: center;  text-shadow: 50px 20px 6px #FFFFFF; font-size: 23px; font-family: &#39;微软雅黑&#39;; color: #FFFFFF;"
            height="120" onclick="duomieti3(&#39;${id}&#39;)">电控系统
        </td>

        <td width="30%" class="aaa"
            style="background-image:url(img/d.png) ; cursor:pointer;text-align: center; text-shadow: 50px 20px 6px #FFFFFF;  font-size: 23px; font-family: &#39;微软雅黑&#39;; color: #FFFFFF;"
            height="120" onclick="duomieti4(&#39;${id}&#39;)">通讯系统
        </td>

        <td width="30%" class="aaa"
            style="background-image:url(img/d.png) ;cursor:pointer; text-align: center; text-shadow: 50px 20px 6px #FFFFFF; font-size: 23px; font-family: &#39;微软雅黑&#39;; color: #FFFFFF;"
            height="120" onclick="duomieti5(&#39;${id}&#39;)">高级设置
        </td>

    </tr>
    <tr>
        <td colspan="3" align="center" style="color: #0000FF;font-size: 20px; background: #FFFAE8;">策码奔腾科技团队</td>
    </tr>
    </tbody>
</table>


<style>

    .aaa:hover {
        border: #ffffff solid 1px;

    }

    .item1 {
        margin-left: 30px;
    }

    .item2 {
        margin-left: 30px;
    }

    .item3 {
        margin-left: 30px;
    }

    .owin {
        width: 200px;
        height: 1px;
        background-color: #ffffff;
        margin: 50px auto;
        -webkit-animation: rotateplane 2.2s infinite ease-in-out;
        animation: rotateplane 2.2s infinite ease-in-out;
    }

    body {
        background-image: url(img/vv.jpg);
    }

    @-webkit-keyframes rotateplane {
        0% {
            -webkit-transform: perspective(120px)
        }
        50% {
            -webkit-transform: perspective(120px) rotateY(180deg)
        }
        100% {
            -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg)
        }
    }

    @keyframes rotateplane {
        0% {
            transform: perspective(120px) rotateX(0deg) rotateY(0deg);
            -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
        }
        50% {
            transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
            -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
        }
        100% {
            transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
        }
    }

</style>


<script src="jquery-3.3.1.min.js"></script>
<script src="Concant.js"></script>


<script>

    /**
     * 加载数据
     */
    function initData() {

        $.ajax({
            type: "GET",
            async: false,
            url: MANAGERALLURL,
            dataType: "json",
            success: function (json) {
                var rest1 = eval(json);

                var rest = rest1["data"];
                document.getElementById("comm_state").innerText = isZone(rest["comm_state"]);
                document.getElementById("media_moudle_state").innerText = isZone(rest["media_moudle_state"]);
                document.getElementById("system_state").innerText = isZone(rest["system_state"]);
                document.getElementById("hardware_heal").innerText = isZone(rest["hardware_heal"]);
                document.getElementById("service_state").innerText = isZone(rest["service_state"]);
                document.getElementById("visit_moudle_state").innerText = isZone(rest["visit_moudle_state"]);
                document.getElementById("monitor_moudle_state").innerText = isZone(rest["monitor_moudle_state"]);
                document.getElementById("power_moudle_state").innerText = isZone(rest["power_moudle_state"]);
                document.getElementById("comm_moudle_state").innerText = isZone(rest["comm_moudle_state"]);
                document.getElementById("hardware_state").innerText = isZone(rest["hardware_state"]);
                document.getElementById("hard_monitor_state").innerText = isZone(rest["hard_monitor_state"]);
                document.getElementById("sensor_state").innerText = isZone(rest["sensor_state"]);
                document.getElementById("hard_relay_state").innerText = isZone(rest["hard_relay_state"]);
                document.getElementById("controlled_hardware_state").innerText = isZone(rest["controlled_hardware_state"]);
                document.getElementById("terminal_state").innerText = isZone(rest["terminal_state"]);
                document.getElementById("tran_channel_state").innerText = isZone(rest["tran_channel_state"]);


                document.getElementById("comm_state").style.color = isColor(rest["comm_state"]);
                document.getElementById("media_moudle_state").style.color = isColor(rest["media_moudle_state"]);
                document.getElementById("system_state").style.color = isColor(rest["system_state"]);
                document.getElementById("hardware_heal").style.color = isColor(rest["hardware_heal"]);
                document.getElementById("service_state").style.color = isColor(rest["service_state"]);
                document.getElementById("visit_moudle_state").style.color = isColor(rest["visit_moudle_state"]);
                document.getElementById("monitor_moudle_state").style.color = isColor(rest["monitor_moudle_state"]);
                document.getElementById("power_moudle_state").style.color = isColor(rest["power_moudle_state"]);
                document.getElementById("comm_moudle_state").style.color = isColor(rest["comm_moudle_state"]);
                document.getElementById("hardware_state").style.color = isColor(rest["hardware_state"]);
                document.getElementById("hard_monitor_state").style.color = isColor(rest["hard_monitor_state"]);
                document.getElementById("sensor_state").style.color = isColor(rest["sensor_state"]);
                document.getElementById("hard_relay_state").style.color = isColor(rest["hard_relay_state"]);
                document.getElementById("controlled_hardware_state").style.color = isColor(rest["controlled_hardware_state"]);
                document.getElementById("terminal_state").style.color = isColor(rest["terminal_state"]);
                document.getElementById("tran_channel_state").style.color = isColor(rest["tran_channel_state"]);
            },
            error: function (data) {
                alert("连接错误...")
            }
        });
    }


</script>
>


<script>


    /**
     * 显示字符
     * @param i
     */
    function isZone(i) {

        if (i == -1) {
            return "故障";
        }
        if (i == 0) {
            return "瑕疵";
        }
        if (i == 1) {
            return "正常";
        }
        if (i == 2) {
            return "良好";
        }
        if (i == 3) {
            return "优秀";
        }

    }


    /**
     * 显示颜色
     * @param i
     */
    function isColor(i) {
        if (i == -1) {
            return "#f00";
        }
        if (i == 0) {
            return "#FFC125";
        }
        if (i == 1) {
            return "#8EE5EE";
        }
        if (i == 2) {
            return "#9AFF9A";
        }
        if (i == 3) {
            return "#9ACD32";
        }
    }


    function commit() {

        var username1 = document.getElementById("username");
        var psw1 = document.getElementById("psw");

        // 定时跳转
        setTimeout("javascript:location.href='index.html'", 1000);

    }

    function forget() {

        alert("忘了就忘了吧！ ");

    }


    function duomieti() {

        // 定时跳转
        setTimeout("javascript:location.href='mediaManager.html'", 100);

    }


    function duomieti1() {

        // 定时跳转
        setTimeout("javascript:location.href='VisitorManager.html'", 500);

    }


    function duomieti2() {

        // 定时跳转
        setTimeout("javascript:location.href='monitorManager.html'", 500);

    }


    function duomieti3() {

        // 定时跳转
        setTimeout("javascript:location.href='ElectronicManager.html'", 500);

    }


    function duomieti4() {

        // 定时跳转
        setTimeout("javascript:location.href='communicationManager.html'", 500);

    }


    function duomieti5() {

        // 定时跳转
        setTimeout("javascript:location.href='senior.html'", 500);

    }


    //这里就一句话就可以显示时间，但不是我想要的最理想结果
    setInterval("time.innerHTML=new Date().toLocaleString()+' 星期'+'日一二三四五六'.charAt(new Date().getDay());", 1000);

    setInterval("getSpeed()", 1000);

    function getSpeed() {
        var startTime = new Date().getTime();
        var img = new Image();
        img.src = "../backstageUI/img/d.png?timeStamp=" + startTime;
        img.onload = function () {
            // 图片大小
            var size = 204.94 * 1000;
            var endTime = new Date().getTime();
            var speed = parseInt(size / (endTime - startTime));
            var unit = "KB/S";
            if (speed >= 1024) {
                speed = (speed / 1024).toFixed(2);
                unit = "MB/S";
            }
            document.getElementById("innet").innerHTML = "speed:" + speed + unit + " —— time：" + (endTime - startTime) / 1000 + "s";
        };
    }
</script>

<div class="sogoutip" style="z-index: 2147483645; visibility: hidden; display: none;"></div>
<div class="sogoubottom" id="sougou_bottom" style="display: none;"></div>
<div id="ext_stophi" style="z-index: 2147483647;">
    <div class="extnoticebg"></div>
    <div class="extnotice"><h2>关闭提示 <a href="http://shop.tenfeiba.com/InternetOfThingsManage/backstageUI/index.html#"
                                       title="关闭提示" id="closenotice" class="closenotice">关闭</a></h2>
        <p id="sogouconfirmtxt"></p>  <a id="sogouconfirm"
                                         href="http://shop.tenfeiba.com/InternetOfThingsManage/backstageUI/index.html#"
                                         class="extconfirm">确 认</a> <a id="sogoucancel"
                                                                       href="http://shop.tenfeiba.com/InternetOfThingsManage/backstageUI/index.html#"
                                                                       class="extconfirm">取 消</a></div>
</div>
<div id="ext_overlay" class="ext_overlayBG" style="display: none; z-index: 2147483646;"></div>
<iframe class="sogou_sugg_feedbackquan" frameborder="0" scrolling="no" src="./index_files/yun6.html"
        style="background: transparent; border: none; display: none; height: 84px; width: 100%; z-index: 2147483645;"></iframe>
</body>
</html>